<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>kafka_log_collection</title>
</head>
<script src="./jquery-3.4.1.min.js"></script>
<body onload="setUserAndJobCode()">
    <button id="user_id" class="set"></button>
    <button id="job_code" class="set"></button>
    <button id="click" class="action" act_type="click">点击</button>
    <button id="collect" class="action" act_type="job_collect">收藏</button>
    <button id="send" class="action" act_type="cv_send">投递</button>
    <button id="upload" class="action" act_type="cv_upload">上传</button>
</body>
<style>
    .action,.set {height: 30px;font-family: 微软雅黑;font-size: 16px;color: aliceblue;border: none;border-radius: 4px;}
    #user_id {background-color: black}
    #job_code {background-color: darkgray}
    #click {background-color: cadetblue;}
    #collect {background-color: cornflowerblue;}
    #send {background-color: coral;}
    #upload {background-color: indianred;}
</style>
<script>
    $(document).ready(function () {
        $(".action").click(function () {
            var user_id = $("#user_id").text();
            var act_time = new Date();
            var action = this.getAttribute("act_type");
            var job_code = $("#job_code").text();
            var log = "user_id："+user_id + "\t" +
                "act_time："+act_time + "\t" +
                "action："+ action + "\t" +
                "job_code："+job_code;
            $.ajax({
                url: "http://192.168.80.100:80/kafka/log",
                type: "POST",
                dataType: "json",
                data: log
            })
            alert("数据上传成功！");
        });
    })
    // 判断是否小于10，小于左边加0，大于不变
    function add0(m){return m<10?'0'+m:m }
    // 获取时间函数
    function formatNewDate(){
        var time = new Date();
        var y = time.getFullYear();
        var m = time.getMonth()+1;
        var d = time.getDate();
        var h = time.getHours();
        var mm = time.getMinutes();
        var s = time.getSeconds();
        return y+'-'+add0(m)+'-'+add0(d)+'-'+add0(h)+'-'+add0(mm)+'-'+add0(s);
    }
    // 页面加载设置user和jobcode
    function setUserAndJobCode(){
        $("#user_id").text("user"+formatNewDate());
        $("#job_code").text("code"+formatNewDate());
    }
</script>
</html>